<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<script type="text/javascript">
			console.log('------------------------------------');
			// var Person = (name, age) => {
			//  this.name = name
			//  this.age = age
			// }
			// var p = new Person('John', 33) // Uncaught TypeError: Person is not a constructor
			console.log('----箭头函数不绑定arguments，取而代之用rest参数...解决----');
			// let fun = (a) => {
			// 	console.log(a); // 111
			// 	// 下面一行会报错
			// 	// Uncaught ReferenceError: arguments is not defined
			// 	// 因为外层全局环境没有arguments对象
			// 	console.log(arguments);
			// };
			// fun(100);
			let C = (...c) => {
				console.log(c);
			}
			C(3, 82, 32, 11323);
			console.log("----箭头函数不绑定this，会捕获其所在的上下文的this值，作为自己的this值----");
			var obj = {
				a: 10,
				b: () => {
					console.log(this.a); // undefined
					console.log(this); // Window {postMessage: ƒ, blur: ƒ, focus: ƒ, close: ƒ, frames: Window, …}
				},
				c: function() {
					console.log(this.a); // 10
					console.log(this); // {a: 10, b: ƒ, c: ƒ}
				}
			}
			obj.b();
			obj.c();
			console.log("----call、apply、bind不会改变箭头函数this值，会改变普通函数this值----");
			var id = 'Global';
			// 箭头函数定义在全局作用域
			let fun1 = () => {
			    console.log(this.id)
			};
			fun1();     // 'Global'
			// this的指向不会改变，永远指向Window对象
			fun1.call({id: 'Obj'});     // 'Global'
			fun1.apply({id: 'Obj'});    // 'Global'
			fun1.bind({id: 'Obj'})();   // 'Global'
			let fun2 = function() {
			    console.log(this.id)
			};
			fun2();     // 'Global'
			fun2.call({id: 'Obj'});     // 'Obj'
			fun2.apply({id: 'Obj'});    // 'Obj'
			fun2.bind({id: 'Obj'})();   // 'Obj'
		</script>
	</body>
</html>
